<template>
  <template v-if="checkPermission">
    <slot />
  </template>
</template>

<script setup lang="ts">
import { isArray } from "lodash-es";
import useMemberStore from "@/store/member";

const { permission, oneof, widthoutPermission } = defineProps<{
  permission?: string | string[];
  oneof?: boolean;
  widthoutPermission?: boolean;
}>();

const { hasPermission, hasAllPermissions, hasOneOfPermission } = useMemberStore();

const checkPermission = computed<boolean>(() => {
  if (widthoutPermission) return true;
  if (isArray(permission)) {
    if (!oneof && hasAllPermissions(permission)) return true;
    else if (oneof && hasOneOfPermission(permission)) return true;
  } else {
    return hasPermission(permission);
  }
  return false;
});
</script>

<style scoped></style>
